import pageStyles from '@/common/pageLayout.less';
import { Form, Spin, Tabs, message } from 'antd';
import Cls from 'classnames';
import { useEffect, useMemo, useState } from 'react';
import { getContractHomePageDataService, handlCheckManageService } from '../services';
import { ContractHomeTableBody } from './ContractHomeTableBody';
import { ContractHomeTableExtraView } from './ContractHomeTableExtraView';
import '../common/styles.less';
import { ContractHomesAPI } from '../common/type';

export const ContractHomeTableView: React.FC<ContractHomesAPI.IContractHomeTableView> = ({ curRes }) => {
  /** 样式根目录 */
  const styleFixCls = 'contract-homesty';

  /** 待办已办搜索表单form */
  const [searchForm] = Form.useForm();

  /** 存入选中的tab标识 */
  const [tabPaneKey, setTabPaneKey] = useState<string>('1');

  /** 回调 */
  const homeCallback = (res: any) => {
    if (res && res?.msgFlag) {
      // setManageDataList(res?.rows);
    } else {
      message.error(res?.msg);
    }
  };

  const { getContractHomePageData, homePageLoading, pagination, data } = getContractHomePageDataService((res) => {});

  /** 获取代办已办数据 */
  // const { taskLoading, getTaskCheckData, pagination, data } = handlCheckManageService(curRes, homeCallback);

  /** 返回子组件 */
  const renderTabsPane = () => {
    if (tabPaneKey == '1' || tabPaneKey == '4') {
      return (
        <ContractHomeTableBody
          curRes={curRes}
          tabPaneKey={tabPaneKey}
          listTableData={data}
          pageSizeObj={pagination}
          getTaskCheckData={getContractHomePageData}
        />
      );
    } else {
      return <></>;
    }
  };

  /** 刷新 */
  const tabsExtraBtns = () => {
    // return <Button type="primary" icon={<ReloadOutlined />} onClick={reloadTaskData} />;
    return (
      <ContractHomeTableExtraView
        searchForm={searchForm}
        styleFixCls={styleFixCls}
        getTaskCheckData={getContractHomePageData}
        tabPaneKey={tabPaneKey}
        pageSizeObj={pagination}
      />
    );
  };

  /** tabs子页面 */
  const tabsItem = useMemo(() => {
    let items: any[] = [
      {
        label: '待办',
        key: '1',
        children: renderTabsPane(),
        isShow: true,
        // isShow: curRes['/contractController/dealHomePage'] || false,
      },
      {
        label: '已办',
        key: '4',
        children: renderTabsPane(),
        isShow: true,
        // isShow: curRes['/contractController/dealedHomePage'] || false,
      },
    ];
    const newItems: any[] = items?.filter((item: any) => item?.isShow);
    return newItems;
  }, [data, tabPaneKey, curRes]);

  useEffect(() => {
    if (tabPaneKey == '1' || tabPaneKey == '4') {
      searchForm?.resetFields();
      getContractHomePageData({
        ...pagination,
        pageSize: 5,
        taskType: tabPaneKey == '1' ? false : true,
      });
    }
  }, [tabPaneKey]);

  return (
    <div className={Cls(`${styleFixCls}-tabsStyle`, pageStyles['commonTabsLine'])}>
      <Spin spinning={homePageLoading}>
        <Tabs
          activeKey={tabPaneKey}
          tabBarExtraContent={tabsExtraBtns()}
          items={tabsItem}
          onChange={(activeKey: string) => {
            setTabPaneKey(activeKey);
          }}
        />
      </Spin>
    </div>
  );
};
